var tplOC = 
	'<div>'+
		'<div class="item-img"><img src="resources/images/shopping_cart.png"></div>'+
		'<div class="list-proveedor">{proveedor}</div>'+
		'<div class="list-moneda">{totalNeto} {moneda}</div>'+
		'<div class="list-fecha">{fecha}</div>'+
	'</div>';

ordenCompraView = Ext.extend(Ext.Panel, 
{
	fullscreen: true,
	layout: 'card',
		
	initComponent: function() 
	{
		this.listaOC = new Ext.List(
		{
			id: 'listaOC',
			grouped: false,
			itemTpl: tplOC,
			loadingText: false,
			store: ordenCompraStore			
        });
        
		this.listaOC.on('selectionchange', this.onSelect, this);
        
        this.ordenCompraPanel = new Ext.Panel(
        {	
            layout: 'fit',
            
            dockedItems: [
            {
                xtype: 'toolbar',
                title: 'Ordenes de Compra',
                layout: 
                {
                    pack: 'center'
                },
                items: [
                {
                	xtype: 'box'
                }]
            }
            ],
            
            items: this.listaOC,
            
            listeners: 
            {
                activate: 
                { 
        			fn: function()
        			{
                    	this.listaOC.getSelectionModel().deselectAll();
                    	Ext.repaint();
        			}, 
        			scope: this 
        		}
            }
        });
        
        this.items = this.ordenCompraPanel;
        
        ordenCompraView.superclass.initComponent.call(this);
    },
        
    onSelect: function(selectionmodel, records)
    {
    	if (records[0] !== undefined) 
    	{
           var detalleOCCard = new detalleOrdenCompra(
           {
        	   prevCard: this.ordenCompraPanel,
               record: records[0]
           });

           this.setActiveItem(detalleOCCard, 'slide');
        }
    }
});

Ext.reg('ordenCompraView', ordenCompraView);